<template>
  <el-dialog :visible.sync="visible" :title="$t('schedule.log')" :close-on-click-modal="false" :close-on-press-escape="false" width="75%">
    <el-form :inline="true" :model="dataForm" @keyup.enter.native="queryList()">
      <el-form-item>
        <el-input size="mini" v-model="dataForm.keyContent" :placeholder="$t('keyContent')" clearable></el-input>
      </el-form-item>
	  <el-form-item>
	    <el-select size="mini" v-model="dataForm.isSuccess" clearable  :placeholder="$t('schedule.status')" >
	        <el-option :key="1":label="$t('schedule.statusLog1')":value="1"> </el-option>
	  	    <el-option :key="0":label="$t('schedule.statusLog0')":value="0"> </el-option>
	      </el-select>
	  </el-form-item>
	  <el-form-item>
		  <el-date-picker
				size="mini"
		        v-model="value2"
		        type="datetimerange"
		        :picker-options="pickerOptions"
				value-format="yyyy-MM-dd HH:mm:ss"
		        range-separator="至"
		        start-placeholder="开始日期"
		        end-placeholder="结束日期"
		        align="right">
		      </el-date-picker>
	  </el-form-item>
	  
      <el-form-item>
        <el-button  size="mini" @click="queryList()">{{ $t('query') }}</el-button>
      </el-form-item>
	  <el-form-item>
	    <el-button type="danger" v-if="$hasPermission('schedule:clearJobLog')" size="mini" @click="clear()">{{ $t('schedule.clear') }}</el-button>
	  </el-form-item>
    </el-form>
	
	
    <el-table
      v-loading="dataListLoading"
      :data="dataList"
      border
      @sort-change="dataListSortChangeHandle"
      height="460"
      style="width: 100%;">
	  <el-table-column prop="jobId" :label="$t('schedule.jobId')" header-align="center" align="center"></el-table-column>
      <el-table-column prop="jobName" :label="$t('schedule.jobName')" header-align="center" align="center" width="80"></el-table-column>
      <el-table-column prop="beanName" :label="$t('schedule.beanName')" header-align="center" align="center"></el-table-column>
	  <el-table-column prop="methodName" :label="$t('schedule.methodName')" header-align="center" align="center"></el-table-column>
      <el-table-column prop="params" :label="$t('schedule.params')" header-align="center" align="center"></el-table-column>
      <el-table-column prop="status" :label="$t('schedule.status')" header-align="center" align="center">
        <template slot-scope="scope">
          <el-tag v-if="scope.row.isSuccess === 1" size="small">{{ $t('schedule.statusLog1') }}</el-tag>
          <el-tag v-else type="danger" size="small" @click.native="showErrorInfo(scope.row.id)" style="cursor: pointer;">{{ $t('schedule.statusLog0') }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="time" :label="$t('schedule.times')" header-align="center" align="center"></el-table-column>
      <el-table-column prop="createTime" :label="$t('schedule.createDate')" header-align="center" align="center" width="180"></el-table-column>
    </el-table>
    <el-pagination
      :current-page="pageNo"
      :page-sizes="[10, 20, 50, 100]"
      :page-size="pageSize"
      :total="total"
      layout="total, sizes, prev, pager, next, jumper"
      @size-change="pageSizeChangeHandle"
      @current-change="pageCurrentChangeHandle">
    </el-pagination>
  </el-dialog>
</template>

<script>
import mixinViewModule from '@/mixins/view-module'
export default {
  mixins: [mixinViewModule],
  data () {
    return {
      visible: false,
      mixinViewModuleOptions: {
        getDataListURL: '/pc/schedule/jobLogPage',
        getDataListIsPage: true
      },
	  value2: [],
      dataForm: {
        keyContent: '',
		isSuccess: null,
		createTimeStart: null,
		createTimeEnd: null
      }
	  
	  //日期的快捷选项
	  ,pickerOptions: {
	    shortcuts: [{
	  	text: '最近一周',
	  	onClick(picker) {
	  	  const end = new Date();
	  	  const start = new Date();
	  	  start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
	  	  picker.$emit('pick', [start, end]);
	  	}
	    }, {
	  	text: '最近一个月',
	  	onClick(picker) {
	  	  const end = new Date();
	  	  const start = new Date();
	  	  start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
	  	  picker.$emit('pick', [start, end]);
	  	}
	    }, {
	  	text: '最近三个月',
	  	onClick(picker) {
	  	  const end = new Date();
	  	  const start = new Date();
	  	  start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
	  	  picker.$emit('pick', [start, end]);
	  	}
	    }]
	  }
	  
    }
  },
  methods: {
    init () {
      this.visible = true
      this.queryList()
    },
    // 失败信息
    showErrorInfo (id) {
		var p = {
			params: {
				id: id
			}
		}
      this.$http.get(`/pc/schedule/getJobLog`,p).then(({ data: res }) => {
        if (res.code !== 200) {
          return this.$message.error(res.msg)
        }
        this.$alert(res.data.exceptionDetail)
      }).catch(() => {})
    },
	queryList(){
		if(this.value2 != null){
			this.dataForm.createTimeStart = this.value2[0] 
			this.dataForm.createTimeEnd = this.value2[1] 
		}else{
			this.dataForm.createTimeStart = null
			this.dataForm.createTimeEnd = null
		}
		this.getDataList()
	},
	clear(){
		this.$confirm('此操作将永久删除任务日志, 是否继续?', '提示', {
		  confirmButtonText: '确定',
		  cancelButtonText: '取消',
		  type: 'warning'
		}).then(() => {
			this.$http.post(`/pc/schedule/clearJobLog`).then(({ data: res }) => {
			  if (res.code !== 200) {
			    return this.$message.error(res.msg)
			  }
			  this.$message({
				type: 'success',
				message: '清空成功!'
			  });
			  this.getDataList()
			}).catch(() => {})
		}).catch(() => {
		  this.$message({
			type: 'info',
			message: '已取消删除'
		  });          
		});
		
		
		
		
		
	}
  }
}
</script>
